<template>
	<gui-page  style="background: #f3f3f3;">
		<template v-slot:gBody>
			<view class="gui-padding-m">
				<view class="gui-bg-white detail-items gui-border-radius" style="padding: 60px 0;">
					<view class="flex flex-c align-items">
						<view><text class="gui-icons gui-color-green fz32 fb">&#xe60f;</text></view>
						<view class="mt20"><text class="fz20 fb gui-color-green">支付成功</text></view>
						<view class="mt20">
							<button 
								type="default" 
								@click="toOrder"
								class="gui-button-mini gui-gtbg-green" 
								style="width:282rpx;">
									<text class="gui-color-white gui-button-text-mini gui-icons">&#xe639; 点击查看订单</text>
								</button>
						</view>
					</view>
				</view>
				<view class="gui-bg-white detail-items mt10" ref="like">
					<view class="fb fz18">猜你喜欢</view>
					<view class="cainibox mt20">
						<view class="items flex mb15" v-for="num in 10" @click="toDetail">
							<view>
								<image src="../../static/logo.png"></image>
							</view>
							<view class="ml15">
								<view class="tit fz15 fb">炙鹿寿司|【品质】寿司拼盘套餐(共20件)</view>
								<view class="flex mt5 align-items">
									<text class="red fz16 fb">￥28</text>
									<text class="textdel fz11 gui-color-gray ml2">￥71.40</text>
									<text class="red fz12 ml5">2.9折</text>
									<text class="gui-color-gray fz12 ml10">已销售100+</text>
								</view>
								<view class="gui-bg-gray mt8 fz12 flex justify-content-between align-items"
									style="padding:5px 10px;">
									<view>
										<text class="gui-icons">&#xe704;</text>
										<text class="ml5">榴莲嘟嘟(番禺万民城店)</text>
									</view>
									<view class="gui-color-gray">396m</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</template>
	</gui-page>
</template>
<script>
	export default {
		data() {
			return {
				scroll:false,
				items: [
					[80, '', '我的订单'],
					[100, '', '优惠券'],
					[50, '', '关注店铺'],
					[99, '', '收藏']
				]
			}
		},
		methods: {
			toDetail() {
				uni.navigateTo({
					url: "/pages/shop/detail"
				})
			},
			toOrder(){
				uni.navigateTo({
					url:"/pages/user/order"
				})
			}
			
		}
	}
</script>
<style scoped lang="scss">
	.detail-items {
		padding: 15px;
		border-radius: 10px;
	}

	.cainibox {
		.items {
			border-bottom: 1px solid #eee;
			padding-bottom: 15px;

			image {
				width: 100px;
				height: 100px;
				border-radius: 10px;
			}
		}
	}

</style>